<!--
author: 何其沆(pooky)
desc: 月度列表
date: 2021-11-18
-->
<template>
  <div class="statistics-table-right">
    <columnItem title="Weekly Tasks" :data="mData[0]" />
    <columnItem title="Monthly Tasks" :data="mData[1]" />
    <div class="right-item">
      <div class="right-item-top">
        <!--        <div>First</div>
        <div>Week</div>-->
        <div>1st</div>
      </div>
      <div class="right-item-content">
        <div v-if="mData[4]" class="item">
          {{ mData[4][0] }}
          <span
            v-if="
              monthData.data.phaseData &&
              monthData.data.phaseData[0] &&
              monthData.data.phaseData[0].phaseResultData[0].isEdit
            "
            class="icon icon-icon_edit"
            @click="clickEdit(1, monthData.data.phaseData[0].phaseResultData[0].id)"></span>
          <editPanel
            v-if="firstTouchedClientsEdit"
            :editValue="editValue"
            :editId="editId"
            @cancel="closeAll"
            @refresh="refresh" />
        </div>
        <div v-if="mData[4]" class="item">
          {{ mData[4][1] }}
          <span
            v-if="
              monthData.data.phaseData &&
              monthData.data.phaseData[1] &&
              monthData.data.phaseData[1].phaseResultData[0].isEdit
            "
            class="icon icon-icon_edit"
            @click="clickEdit(2, monthData.data.phaseData[1].phaseResultData[0].id)"></span>
          <editPanel
            v-if="firstResponsiveClientsEdit"
            :editValue="editValue"
            :editId="editId"
            @cancel="closeAll"
            @refresh="refresh" />
        </div>
        <div v-if="mData[4]" class="item">
          {{ mData[4][2] }}
          <span
            v-if="
              monthData.data.phaseData &&
              monthData.data.phaseData[2] &&
              monthData.data.phaseData[2].phaseResultData[0].isEdit
            "
            class="icon icon-icon_edit"
            @click="clickEdit(3, monthData.data.phaseData[2].phaseResultData[0].id)"></span>
          <editPanel
            v-if="firstPositiveClientsEdit"
            :editValue="editValue"
            :editId="editId"
            @cancel="closeAll"
            @refresh="refresh" />
        </div>
        <div
          v-if="mData[4]"
          class="item"
          :style="{
            'padding-right':
              monthData.data.phaseData &&
              monthData.data.phaseData[0] &&
              monthData.data.phaseData[0].phaseResultData[0].isEdit
                ? '48px'
                : '24px'
          }">
          {{ mData[4][3] }}
        </div>
        <div
          v-if="mData[4]"
          class="item"
          :style="{
            'padding-right':
              monthData.data.phaseData &&
              monthData.data.phaseData[0] &&
              monthData.data.phaseData[0].phaseResultData[0].isEdit
                ? '48px'
                : '24px'
          }">
          {{ mData[4][4] }}
        </div>
        <div
          v-if="mData[4]"
          class="item"
          :style="{
            'padding-right':
              monthData.data.phaseData &&
              monthData.data.phaseData[0] &&
              monthData.data.phaseData[0].phaseResultData[0].isEdit
                ? '48px'
                : '24px'
          }">
          {{ mData[4][5] }}
        </div>
        <div
          v-if="mData[4]"
          class="item"
          :style="{
            'padding-right':
              monthData.data.phaseData &&
              monthData.data.phaseData[0] &&
              monthData.data.phaseData[0].phaseResultData[0].isEdit
                ? '48px'
                : '24px'
          }">
          {{ mData[4][6] }}
        </div>
        <div v-if="mData.length === 0">
          <div class="item">-</div>
          <div class="item">-</div>
          <div class="item">-</div>
          <div class="item">-</div>
          <div class="item">-</div>
          <div class="item">-</div>
          <div class="item">-</div>
        </div>
      </div>
    </div>
    <columnItem title="1st(%)" :data="mData[5]" />
    <div class="right-item">
      <div class="right-item-top">
        <!--        <div>Second</div>
        <div>Week</div>-->
        <div>2nd</div>
      </div>
      <div class="right-item-content">
        <div v-if="mData[6]" class="item">
          {{ mData[6][0] }}
          <span
            v-if="
              monthData.data.phaseData &&
              monthData.data.phaseData[0] &&
              monthData.data.phaseData[0].phaseResultData[1].isEdit
            "
            class="icon icon-icon_edit"
            @click="clickEdit(4, monthData.data.phaseData[0].phaseResultData[1].id)"></span>
          <editPanel
            v-if="secondTouchedClientsEdit"
            :editValue="editValue"
            :editId="editId"
            @cancel="closeAll"
            @refresh="refresh" />
        </div>
        <div v-if="mData[6]" class="item">
          {{ mData[6][1] }}
          <span
            v-if="
              monthData.data.phaseData &&
              monthData.data.phaseData[1] &&
              monthData.data.phaseData[1].phaseResultData[1].isEdit
            "
            class="icon icon-icon_edit"
            @click="clickEdit(5, monthData.data.phaseData[1].phaseResultData[1].id)"></span>
          <editPanel
            v-if="secondResponsiveClientsEdit"
            :editValue="editValue"
            :editId="editId"
            @cancel="closeAll"
            @refresh="refresh" />
        </div>
        <div v-if="mData[6]" class="item">
          {{ mData[6][2] }}
          <span
            v-if="
              monthData.data.phaseData &&
              monthData.data.phaseData[2] &&
              monthData.data.phaseData[2].phaseResultData[1].isEdit
            "
            class="icon icon-icon_edit"
            @click="clickEdit(6, monthData.data.phaseData[2].phaseResultData[1].id)"></span>
          <editPanel
            v-if="secondPositiveClientsEdit"
            :editValue="editValue"
            :editId="editId"
            @cancel="closeAll"
            @refresh="refresh" />
        </div>
        <div
          v-if="mData[6]"
          class="item"
          :style="{
            'padding-right':
              monthData.data.phaseData &&
              monthData.data.phaseData[0] &&
              monthData.data.phaseData[0].phaseResultData[1].isEdit
                ? '48px'
                : '24px'
          }">
          {{ mData[6][3] }}
        </div>
        <div
          v-if="mData[6]"
          class="item"
          :style="{
            'padding-right':
              monthData.data.phaseData &&
              monthData.data.phaseData[0] &&
              monthData.data.phaseData[0].phaseResultData[1].isEdit
                ? '48px'
                : '24px'
          }">
          {{ mData[6][4] }}
        </div>
        <div
          v-if="mData[6]"
          class="item"
          :style="{
            'padding-right':
              monthData.data.phaseData &&
              monthData.data.phaseData[0] &&
              monthData.data.phaseData[0].phaseResultData[1].isEdit
                ? '48px'
                : '24px'
          }">
          {{ mData[6][5] }}
        </div>
        <div
          v-if="mData[6]"
          class="item"
          :style="{
            'padding-right':
              monthData.data.phaseData &&
              monthData.data.phaseData[0] &&
              monthData.data.phaseData[0].phaseResultData[1].isEdit
                ? '48px'
                : '24px'
          }">
          {{ mData[6][6] }}
        </div>
        <div v-if="mData.length === 0">
          <div class="item">-</div>
          <div class="item">-</div>
          <div class="item">-</div>
          <div class="item">-</div>
          <div class="item">-</div>
          <div class="item">-</div>
          <div class="item">-</div>
        </div>
      </div>
    </div>
    <columnItem title="2nd(%)" :data="mData[7]" />
    <div class="right-item">
      <div class="right-item-top">
        <!--        <div>Third</div>
        <div>Week</div>-->
        <div>3rd</div>
      </div>
      <div class="right-item-content">
        <div v-if="mData[8]" class="item">
          {{ mData[8][0] }}
          <span
            v-if="
              monthData.data.phaseData &&
              monthData.data.phaseData[0] &&
              monthData.data.phaseData[0].phaseResultData[2].isEdit
            "
            class="icon icon-icon_edit"
            @click="clickEdit(7, monthData.data.phaseData[0].phaseResultData[2].id)"></span>
          <editPanel
            v-if="thirdTouchedClientsEdit"
            :editValue="editValue"
            :editId="editId"
            @cancel="closeAll"
            @refresh="refresh" />
        </div>
        <div v-if="mData[8]" class="item">
          {{ mData[8][1] }}
          <span
            v-if="
              monthData.data.phaseData &&
              monthData.data.phaseData[1] &&
              monthData.data.phaseData[1].phaseResultData[2].isEdit
            "
            class="icon icon-icon_edit"
            @click="clickEdit(8, monthData.data.phaseData[1].phaseResultData[2].id)"></span>
          <editPanel
            v-if="thirdResponsiveClientsEdit"
            :editValue="editValue"
            :editId="editId"
            @cancel="closeAll"
            @refresh="refresh" />
        </div>
        <div v-if="mData[8]" class="item">
          {{ mData[8][2] }}
          <span
            v-if="
              monthData.data.phaseData &&
              monthData.data.phaseData[2] &&
              monthData.data.phaseData[2].phaseResultData[2].isEdit
            "
            class="icon icon-icon_edit"
            @click="clickEdit(9, monthData.data.phaseData[2].phaseResultData[2].id)"></span>
          <editPanel
            v-if="thirdPositiveClientsEdit"
            :editValue="editValue"
            :editId="editId"
            @cancel="closeAll"
            @refresh="refresh" />
        </div>
        <div
          v-if="mData[8]"
          class="item"
          :style="{
            'padding-right':
              monthData.data.phaseData &&
              monthData.data.phaseData[0] &&
              monthData.data.phaseData[0].phaseResultData[2].isEdit
                ? '48px'
                : '24px'
          }">
          {{ mData[8][3] }}
        </div>
        <div
          v-if="mData[8]"
          class="item"
          :style="{
            'padding-right':
              monthData.data.phaseData &&
              monthData.data.phaseData[0] &&
              monthData.data.phaseData[0].phaseResultData[2].isEdit
                ? '48px'
                : '24px'
          }">
          {{ mData[8][4] }}
        </div>
        <div
          v-if="mData[8]"
          class="item"
          :style="{
            'padding-right':
              monthData.data.phaseData &&
              monthData.data.phaseData[0] &&
              monthData.data.phaseData[0].phaseResultData[2].isEdit
                ? '48px'
                : '24px'
          }">
          {{ mData[8][5] }}
        </div>
        <div
          v-if="mData[8]"
          class="item"
          :style="{
            'padding-right':
              monthData.data.phaseData &&
              monthData.data.phaseData[0] &&
              monthData.data.phaseData[0].phaseResultData[2].isEdit
                ? '48px'
                : '24px'
          }">
          {{ mData[8][6] }}
        </div>
        <div v-if="mData.length === 0">
          <div class="item">-</div>
          <div class="item">-</div>
          <div class="item">-</div>
          <div class="item">-</div>
          <div class="item">-</div>
          <div class="item">-</div>
          <div class="item">-</div>
        </div>
      </div>
    </div>
    <columnItem title="3rd(%)" :data="mData[9]" />
    <div class="right-item">
      <div class="right-item-top">
        <!--        <div>Fourth</div>
        <div>Week</div>-->
        <div>4th</div>
      </div>
      <div class="right-item-content">
        <div v-if="mData[10]" class="item">
          {{ mData[10][0] }}
          <span
            v-if="
              monthData.data.phaseData &&
              monthData.data.phaseData[0] &&
              monthData.data.phaseData[0].phaseResultData[3].isEdit
            "
            class="icon icon-icon_edit"
            @click="clickEdit(10, monthData.data.phaseData[0].phaseResultData[3].id)"></span>
          <editPanel
            v-if="fourthTouchedClientsEdit"
            :editValue="editValue"
            :editId="editId"
            @cancel="closeAll"
            @refresh="refresh" />
        </div>
        <div v-if="mData[10]" class="item">
          {{ mData[10][1] }}
          <span
            v-if="
              monthData.data.phaseData &&
              monthData.data.phaseData[1] &&
              monthData.data.phaseData[1].phaseResultData[3].isEdit
            "
            class="icon icon-icon_edit"
            @click="clickEdit(11, monthData.data.phaseData[1].phaseResultData[3].id)"></span>
          <editPanel
            v-if="fourthResponsiveClientsEdit"
            :editValue="editValue"
            :editId="editId"
            @cancel="closeAll"
            @refresh="refresh" />
        </div>
        <div v-if="mData[10]" class="item">
          {{ mData[10][2] }}
          <span
            v-if="
              monthData.data.phaseData &&
              monthData.data.phaseData[2] &&
              monthData.data.phaseData[2].phaseResultData[3].isEdit
            "
            class="icon icon-icon_edit"
            @click="clickEdit(12, monthData.data.phaseData[2].phaseResultData[3].id)"></span>
          <editPanel
            v-if="fourthPositiveClientsEdit"
            :editValue="editValue"
            :editId="editId"
            @cancel="closeAll"
            @refresh="refresh" />
        </div>
        <div
          v-if="mData[10]"
          class="item"
          :style="{
            'padding-right':
              monthData.data.phaseData &&
              monthData.data.phaseData[0] &&
              monthData.data.phaseData[0].phaseResultData[3].isEdit
                ? '48px'
                : '24px'
          }">
          {{ mData[10][3] }}
        </div>
        <div
          v-if="mData[10]"
          class="item"
          :style="{
            'padding-right':
              monthData.data.phaseData &&
              monthData.data.phaseData[0] &&
              monthData.data.phaseData[0].phaseResultData[3].isEdit
                ? '48px'
                : '24px'
          }">
          {{ mData[10][4] }}
        </div>
        <div
          v-if="mData[10]"
          class="item"
          :style="{
            'padding-right':
              monthData.data.phaseData &&
              monthData.data.phaseData[0] &&
              monthData.data.phaseData[0].phaseResultData[3].isEdit
                ? '48px'
                : '24px'
          }">
          {{ mData[10][5] }}
        </div>
        <div
          v-if="mData[10]"
          class="item"
          :style="{
            'padding-right':
              monthData.data.phaseData &&
              monthData.data.phaseData[0] &&
              monthData.data.phaseData[0].phaseResultData[3].isEdit
                ? '48px'
                : '24px'
          }">
          {{ mData[10][6] }}
        </div>
        <div v-if="mData.length === 0">
          <div class="item">-</div>
          <div class="item">-</div>
          <div class="item">-</div>
          <div class="item">-</div>
          <div class="item">-</div>
          <div class="item">-</div>
          <div class="item">-</div>
        </div>
      </div>
    </div>
    <columnItem title="4th(%)" :data="mData[11]" />
    <div v-if="mData[12] && mData[12].length > 0" class="right-item">
      <div class="right-item-top">
        <!--        <div>Fifth</div>
        <div>Week</div>-->
        <div>5th</div>
      </div>
      <div class="right-item-content">
        <div class="item">
          {{ mData[12][0] }}
          <span
            v-if="
              monthData.data.phaseData &&
              monthData.data.phaseData[0].phaseResultData[4] &&
              monthData.data.phaseData[0].phaseResultData[4].isEdit
            "
            class="icon icon-icon_edit"
            @click="clickEdit(13, monthData.data.phaseData[0].phaseResultData[4].id)"></span>
          <editPanel
            v-if="fifthTouchedClientsEdit"
            :editValue="editValue"
            :editId="editId"
            @cancel="closeAll"
            @refresh="refresh" />
        </div>
        <div class="item">
          {{ mData[12][1] }}
          <span
            v-if="
              monthData.data.phaseData &&
              monthData.data.phaseData[1].phaseResultData[4] &&
              monthData.data.phaseData[1].phaseResultData[4].isEdit
            "
            class="icon icon-icon_edit"
            @click="clickEdit(14, monthData.data.phaseData[1].phaseResultData[4].id)"></span>
          <editPanel
            v-if="fifthResponsiveClientsEdit"
            :editValue="editValue"
            :editId="editId"
            @cancel="closeAll"
            @refresh="refresh" />
        </div>
        <div class="item">
          {{ mData[12][2] }}
          <span
            v-if="
              monthData.data.phaseData &&
              monthData.data.phaseData[2].phaseResultData[4] &&
              monthData.data.phaseData[2].phaseResultData[4].isEdit
            "
            class="icon icon-icon_edit"
            @click="clickEdit(15, monthData.data.phaseData[2].phaseResultData[4].id)"></span>
          <editPanel
            v-if="fifthPositiveClientsEdit"
            :editValue="editValue"
            :editId="editId"
            @cancel="closeAll"
            @refresh="refresh" />
        </div>
        <div
          class="item"
          :style="{
            'padding-right':
              monthData.data.phaseData &&
              monthData.data.phaseData[0] &&
              monthData.data.phaseData[0].phaseResultData[4].isEdit
                ? '48px'
                : '24px'
          }">
          {{ mData[12][3] }}
        </div>
        <div
          class="item"
          :style="{
            'padding-right':
              monthData.data.phaseData &&
              monthData.data.phaseData[0] &&
              monthData.data.phaseData[0].phaseResultData[4].isEdit
                ? '48px'
                : '24px'
          }">
          {{ mData[12][4] }}
        </div>
        <div
          class="item"
          :style="{
            'padding-right':
              monthData.data.phaseData &&
              monthData.data.phaseData[0] &&
              monthData.data.phaseData[0].phaseResultData[4].isEdit
                ? '48px'
                : '24px'
          }">
          {{ mData[12][5] }}
        </div>
        <div
          class="item"
          :style="{
            'padding-right':
              monthData.data.phaseData &&
              monthData.data.phaseData[0] &&
              monthData.data.phaseData[0].phaseResultData[4].isEdit
                ? '48px'
                : '24px'
          }">
          {{ mData[12][6] }}
        </div>
        <div v-if="mData.length === 0">
          <div class="item">-</div>
          <div class="item">-</div>
          <div class="item">-</div>
          <div class="item">-</div>
          <div class="item">-</div>
          <div class="item">-</div>
          <div class="item">-</div>
        </div>
      </div>
    </div>
    <columnItem v-if="mData[13] && mData[13].length > 0" title="5th(%)" :data="mData[13]" />
    <columnItem title="Monthly Total" :data="mData[2]" />
    <columnItem title="Monthly Total(%)" :data="mData[3]" />
  </div>
</template>

<script setup>
import { ref, computed, watch, inject } from 'vue'
import { useStore } from 'vuex'
import { EDIT_SUCCEEDED } from '@/constants/message.js'
import editPanel from './editPanel.vue'
import columnItem from './columnItem.vue'

const { message } = inject('Feedback')
const store = useStore()
const emits = defineEmits(['refresh'])
const editValue = ref('')
const editId = ref()
const firstTouchedClientsEdit = ref(false)
const firstResponsiveClientsEdit = ref(false)
const firstPositiveClientsEdit = ref(false)
const secondTouchedClientsEdit = ref(false)
const secondResponsiveClientsEdit = ref(false)
const secondPositiveClientsEdit = ref(false)
const thirdTouchedClientsEdit = ref(false)
const thirdResponsiveClientsEdit = ref(false)
const thirdPositiveClientsEdit = ref(false)
const fourthTouchedClientsEdit = ref(false)
const fourthResponsiveClientsEdit = ref(false)
const fourthPositiveClientsEdit = ref(false)
const fifthTouchedClientsEdit = ref(false)
const fifthResponsiveClientsEdit = ref(false)
const fifthPositiveClientsEdit = ref(false)

const monthData = ref(
  computed(() => {
    return store.state.pm.monthData
  })
)
const mData = ref([])
/**
 * 点击编辑
 * @param val
 * @param id
 */
const clickEdit = (val, id) => {
  editId.value = id
  closeAll()
  editValue.value = ''
  if (val === 1) {
    setTimeout(() => {
      firstTouchedClientsEdit.value = true
      editValue.value = Number(monthData.value.data.phaseData[0].phaseResultData[0].result)
    }, 0)
  } else if (val === 2) {
    setTimeout(() => {
      firstResponsiveClientsEdit.value = true
      editValue.value = Number(monthData.value.data.phaseData[1].phaseResultData[0].result)
    }, 0)
  } else if (val === 3) {
    setTimeout(() => {
      firstPositiveClientsEdit.value = true
      editValue.value = Number(monthData.value.data.phaseData[2].phaseResultData[0].result)
    }, 0)
  } else if (val === 4) {
    setTimeout(() => {
      secondTouchedClientsEdit.value = true
      editValue.value = Number(monthData.value.data.phaseData[0].phaseResultData[1].result)
    }, 0)
  } else if (val === 5) {
    setTimeout(() => {
      secondResponsiveClientsEdit.value = true
      editValue.value = Number(monthData.value.data.phaseData[1].phaseResultData[1].result)
    }, 0)
  } else if (val === 6) {
    setTimeout(() => {
      secondPositiveClientsEdit.value = true
      editValue.value = Number(monthData.value.data.phaseData[2].phaseResultData[1].result)
    }, 0)
  } else if (val === 7) {
    setTimeout(() => {
      thirdTouchedClientsEdit.value = true
      editValue.value = Number(monthData.value.data.phaseData[0].phaseResultData[2].result)
    }, 0)
  } else if (val === 8) {
    setTimeout(() => {
      thirdResponsiveClientsEdit.value = true
      editValue.value = Number(monthData.value.data.phaseData[1].phaseResultData[2].result)
    }, 0)
  } else if (val === 9) {
    setTimeout(() => {
      thirdPositiveClientsEdit.value = true
      editValue.value = Number(monthData.value.data.phaseData[2].phaseResultData[2].result)
    }, 0)
  } else if (val === 10) {
    setTimeout(() => {
      fourthTouchedClientsEdit.value = true
      editValue.value = Number(monthData.value.data.phaseData[0].phaseResultData[3].result)
    }, 0)
  } else if (val === 11) {
    setTimeout(() => {
      fourthResponsiveClientsEdit.value = true
      editValue.value = Number(monthData.value.data.phaseData[1].phaseResultData[3].result)
    }, 0)
  } else if (val === 12) {
    setTimeout(() => {
      fourthPositiveClientsEdit.value = true
      editValue.value = Number(monthData.value.data.phaseData[2].phaseResultData[3].result)
    }, 0)
  } else if (val === 13) {
    setTimeout(() => {
      fifthTouchedClientsEdit.value = true
      editValue.value = Number(monthData.value.data.phaseData[0].phaseResultData[4].result)
    }, 0)
  } else if (val === 14) {
    setTimeout(() => {
      fifthResponsiveClientsEdit.value = true
      editValue.value = Number(monthData.value.data.phaseData[1].phaseResultData[4].result)
    }, 0)
  } else if (val === 15) {
    setTimeout(() => {
      fifthPositiveClientsEdit.value = true
      editValue.value = Number(monthData.value.data.phaseData[2].phaseResultData[4].result)
    }, 0)
  }
}
/**
 * 关闭全部
 */
const closeAll = () => {
  firstTouchedClientsEdit.value = false
  firstResponsiveClientsEdit.value = false
  firstPositiveClientsEdit.value = false
  secondTouchedClientsEdit.value = false
  secondResponsiveClientsEdit.value = false
  secondPositiveClientsEdit.value = false
  thirdTouchedClientsEdit.value = false
  thirdResponsiveClientsEdit.value = false
  thirdPositiveClientsEdit.value = false
  fourthTouchedClientsEdit.value = false
  fourthResponsiveClientsEdit.value = false
  fourthPositiveClientsEdit.value = false
  fifthTouchedClientsEdit.value = false
  fifthResponsiveClientsEdit.value = false
  fifthPositiveClientsEdit.value = false
}
/**
 * 刷新
 */
const refresh = () => {
  closeAll()
  message.success(EDIT_SUCCEEDED)
  emits('refresh')
}
/**
 * 监听数据变化
 */
watch(
  monthData,
  newValue => {
    mData.value = []
    const a1 = []
    const a2 = []
    const a3 = []
    const a4 = []
    const a5 = []
    const a6 = []
    const a7 = []
    const a8 = []
    const a9 = []
    const a10 = []
    const a11 = []
    const a12 = []
    const a13 = []
    const a14 = []
    if (newValue.data.phaseData) {
      for (let i = 0; i < newValue.data.phaseData.length; i++) {
        const res = newValue.data.phaseData[i]
        a1.push(res.weeklyTasks)
        a2.push(res.monthlyTasks)
        a3.push(res.total)
        a4.push(res.totalCompletion)
        for (let j = 0; j < res.phaseResultData.length; j++) {
          if (res.phaseResultData[j].name === '1st') {
            a5.push(res.phaseResultData[j].result)
            a6.push(res.phaseResultData[j].completion)
          } else if (res.phaseResultData[j].name === '2nd') {
            a7.push(res.phaseResultData[j].result)
            a8.push(res.phaseResultData[j].completion)
          } else if (res.phaseResultData[j].name === '3rd') {
            a9.push(res.phaseResultData[j].result)
            a10.push(res.phaseResultData[j].completion)
          } else if (res.phaseResultData[j].name === '4th') {
            a11.push(res.phaseResultData[j].result)
            a12.push(res.phaseResultData[j].completion)
          } else if (res.phaseResultData[j].name === '5th') {
            a13.push(res.phaseResultData[j].result)
            a14.push(res.phaseResultData[j].completion)
          }
        }
      }
    }
    mData.value.push(a1)
    mData.value.push(a2)
    mData.value.push(a3)
    mData.value.push(a4)
    mData.value.push(a5)
    mData.value.push(a6)
    mData.value.push(a7)
    mData.value.push(a8)
    mData.value.push(a9)
    mData.value.push(a10)
    mData.value.push(a11)
    mData.value.push(a12)
    mData.value.push(a13)
    mData.value.push(a14)
  },
  {
    deep: true
  }
)
</script>

<style scoped lang="less">
@import './common.less';

:deep(.ant-input) {
  width: 9.27vw !important;
  min-width: 100px !important;
  height: 32px !important;
}
</style>
